<template>
	<view class="page">
		<view class="my-top">
			<!-- 用户信息 -->
			<view class="user-info">
				<view class="portrait">
					<image :src="dataInfo.headimg"></image>
				</view>
				<view class="info">
					<view class="nickname">
						<text>{{dataInfo.nickname}}</text>
					</view>
					<view class="rank">
						<text>ID：{{dataInfo.id}}</text>
					</view>
					<view class="flex flex-align" style="color: #fff;font-size: 24rpx;">
						绑定社区:{{dataInfo.nickname}} <tui-icon name="arrowright" color="#fff" :size="22"></tui-icon>
					</view>
				</view>
			</view>
			
		</view>
		<view class="teamInfo">
			<view class="title">团长概况</view>
			<view class="flex flex-wrap teamList">
				<view class="list">
					<view class="price">0.00</view>
					<view class="wenzi">总收入(元)</view>
				</view>
				<view class="list">
					<view class="price">0</view>
					<view class="wenzi">总订单</view>
				</view>
				<view class="list">
					<view class="price">0</view>
					<view class="wenzi">会员数</view>
				</view>
				<view class="list">
					<view class="price">0</view>
					<view class="wenzi">昨日观看人数</view>
				</view>
				<view class="list">
					<view class="price">0</view>
					<view class="wenzi">今日观看人数</view>
				</view>
			</view>
		</view>
		<view class="teamInfo xiangqing">
			<view class="title">今日详情</view>
			<view class="flex flex-wrap teamList">
				<view class="list">
					<view class="price">0.00</view>
					<view class="wenzi">订单总数(笔)</view>
				</view>
				<view class="list">
					<view class="price">0</view>
					<view class="wenzi">有效订单(笔)</view>
				</view>
				<view class="list">
					<view class="price">0</view>
					<view class="wenzi">付款人数</view>
				</view>
				<view class="list">
					<view class="price">0</view>
					<view class="wenzi">销售额</view>
				</view>
				<view class="list">
					<view class="price">0</view>
					<view class="wenzi">新增会员数</view>
				</view>
				<view class="list">
					<view class="price">0</view>
					<view class="wenzi">售后订单(笔)</view>
				</view>
				<view class="list">
					<view class="price">0</view>
					<view class="wenzi">预估收入</view>
				</view>
				<view class="list">
					<view class="price">0</view>
					<view class="wenzi">今日访客</view>
				</view>
			</view>
		</view>
		<view class="order-info">
			<view class="header flex flex-align flex-bt">
				<view class="left">我的团单</view>
				<view class="right flex flex-align">
					<view class="">查看详情</view>
					<tui-icon name="arrowright" color="#999" :size="24"></tui-icon>
				</view>
			</view>
			<view class="flex">
				<view class="list" @click="onServer('/pages/MyOrderList/MyOrderList?type=1')">
					<view class="icon">
						<text class="iconfont icon-daifukuan"></text>
						<!-- <text class="num">22</text> -->
					</view>
					<view class="title">
						<text>待付款</text>
					</view>
				</view>
				<view class="list" @click="onServer('/pages/MyOrderList/MyOrderList?type=2')">
					<view class="icon">
						<text class="iconfont icon-daifahuo"></text>
						<!-- <text class="num">22</text> -->
					</view>
					<view class="title">
						<text>待配送</text>
					</view>
				</view>
				<view class="list" @click="onServer('/pages/MyOrderList/MyOrderList?type=3')">
					<view class="icon">
						<text class="iconfont icon-daishouhuo"></text>
						<!-- <text class="num">22</text> -->
					</view>
					<view class="title">
						<text>待提货</text>
					</view>
				</view>
				<view class="list" @click="onServer('/pages/MyOrderList/MyOrderList?type=4')">
					<view class="icon">
						<text class="iconfont icon-tuikuan"></text>
						<text class="num">22</text>
					</view>
					<view class="title">
						<text>已完成</text>
					</view>
				</view>
				<view class="list" @click="onServer('/pages/MyOrderList/MyOrderList?type=5')">
					<view class="icon">
						<text class="iconfont icon-daipingjia"></text>
						<!-- <text class="num">22</text> -->
					</view>
					<view class="title">
						<text>售后服务</text>
					</view>
				</view>
			</view>
		</view>
		<view class="shequUser flex flex-align flex-bt">
			<view class="left">社区用户</view>
			<view class="right flex flex-align">
				<view class="">待核销</view>
				<tui-icon name="arrowright" color="#999" :size="24"></tui-icon>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		
		data() {
			return {
				scrollTop: 0,
				isHotline: false,
				dataInfo: '',
				goodsList: [],
				page: 1,
				isRule:false,
				show:false,
				isLogin:false
			};
		},
	
		onShow() {
			let that = this
			
			that.getdata()
		},
		
		methods: {
		
			getdata() {
				let that = this
				that.tui.request("api.auth.center/get", "POST", {}, false, false, true).then((res) => {
					if (res.code == 1) {
						that.dataInfo = res.data
					}
				}).catch((res) => {

				})
			},
			
		}
	}
</script>

<style scoped lang="scss">
	.page{
		position: absolute;
		width: 100%;
		// height: 100%;
		padding-bottom: 100rpx;
	}
	.my-top{
		position: relative;
		width: 100%;padding-bottom: 80rpx;
		background: linear-gradient(to left,$base,$base);
		overflow: hidden;
		/* 用户信息 */
		.user-info{
			display: flex;
			align-items: center;
			padding: 0 5%;
			height: 120rpx;
			margin-top: 40rpx;
			/* #ifdef APP-PLUS */
			margin-top: 130rpx;
			/* #endif */
			/* #ifdef MP */
			margin-top: 200rpx;
			/* #endif */
			.portrait{
				width: 120rpx;
				height: 120rpx;
				margin-right: 20rpx;
				box-sizing: border-box;
				image{
					width: 100%;
					height: 100%;
					border-radius: 100%;
					border: 4rpx solid #FFFFFF;
					box-sizing: border-box;
				}
			}
			.info{
				display: flex;
				flex-direction: column;
				justify-content: center;
				width: 70%;
				height: 100%;
				.nickname{
					width: 100%;
					padding: 10rpx 0;
					text{
						color: #FFFFFF;
						font-size: 28rpx;
					}
				}
				.rank{
					display: flex;
					align-items: center;
					width: 120rpx;
					height: 30rpx;
					text{
						font-size: 24rpx;
						color: #FFFFFF;
						margin-left: 10rpx;
					}
				}
			}
		}
		/* 关注区 */
		
		/* vip */
		
	}
	.teamInfo{background: #fff;margin: -30rpx 30rpx 30rpx;border-radius: 10rpx;padding: 30rpx;position: relative;z-index: 1;text-align: center;
		.title{font-weight: bold;margin-bottom: 20rpx;}
		.list{width: 33.3%;margin: 20rpx 0;
			.price{color: #f20;margin-bottom: 10rpx;font-size: 28rpx;font-weight: bold;}
			.wenzi{color: #999;font-size: 24rpx;}
		}
	}
	.xiangqing{margin-top: 30rpx;
		.list{width: 25%;
			.price{color: #333;}
			.wenzi{color: #999;}
		}
	}
	.order-info{
		width: 94%;
		border-radius: 20rpx;
		background-color: #FFFFFF;
		margin: 20rpx auto;padding:30rpx 0 40rpx;
		.header{padding:0 20rpx 30rpx 30rpx;
			.left{font-weight: bold;}
			.right{
				view{font-size: 24rpx;color: #999;}
			}
		}
		.list{
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			width: 20%;
			height: 100%;
			.icon{
				position: relative;
				display: flex;
				align-items: center;
				.iconfont{
					font-size: 38rpx;
					color: #333333;
				}
				.num{
					position: absolute;
					right: -20rpx;
					top: -20rpx;
					padding: 4rpx;
					font-size: 18rpx;
					color: $base;
					border: 2rpx solid $base;
					border-radius: 100%;
					background-color: #FFFFFF;
				}
			}
			.title{
				display: flex;
				align-items: center;
				margin-top: 10rpx;
				text{
					color: #333333;
					font-size: 24rpx;
				}
			}
		}
	}
	.shequUser{background: #fff;margin: 20rpx 30rpx;padding: 20rpx;border-radius: 10rpx;
		view{font-size: 24rpx;color: #999;}
	}
</style>